<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta content="width=device-width,initial-scale=1.0, user-scalable=no" name="viewport"/>
    <meta content="yes" name=" apple-mobile-web-app-capable"/>
    <meta content="no" name="apple-touch-fullscreen"/>
    <meta content="black" name=" apple-mobile-web-app-status-bar-style"/>
    <meta content="telephone=no" name="format-detection"/>
    <meta http-equiv="x-rim-auto-match" content="none">
    <link rel="stylesheet" href="css/reset.css" />
    <link rel="stylesheet" href="font/iconfont.css">
    <link rel="stylesheet" href="css/style.css" />
    <script src="js/jquery-1.11.3.min.js" type="text/javascript"></script>
    <title>常见问题</title>
    <style>
        body .layui-m-layer .layui-m-layer-footer{
            width: 100% !important;
            bottom: 0!important;
            border-radius:0!important;
        }
        .layui-m-layer-footer .layui-m-layercont{
            border-radius:0!important;
            background: #fff!important;
            padding: 0!important;
        }
    </style>
</head>
<body>
<!--头部-->
<div class="daohanglan_box">
    <div class="title">
        <i class="icon iconfont icon-iconfontjiantou1"></i>
        <h4>常见问题</h4>
    </div>
</div>
<!--问题列表-->
<div>

</div>
<h4 class="questionTitle whiteBg">猜你想问</h4>
<ul class="questionList whiteBg">
    <li>
        <span>积分有什么用？</span>
        <i class="icon iconfont icon-youjiantou"></i>
    </li>
    <li>
        <span>积分有什么用？</span>
        <i class="icon iconfont icon-youjiantou"></i>
    </li>
</ul>
<!--title-->
<div class="contactTitle">如果不能帮你解决问题，请联系我们</div>
<!--contactList-->
<ul class="contactList cashList whiteBg">
    <li>
        <h4>联系方式</h4>
    </li>
    <li>
        <a href="javascript:window.location.href='weixin://'">
            <span class="green"><i class="icon iconfont icon-weixin"></i></span>
            <span>微信</span>
            <i class="icon iconfont icon-youjiantou"></i>
        </a>
    </li>
    <li>
        <a target="_blank" href="http://wpa.qq.com/msgrd?v=3&uin=3081711035&site=qq&menu=yes">
            <span class="blue"><i class="icon iconfont icon-qq"></i></span>
            <span>QQ</span>
            <i class="icon iconfont icon-youjiantou"></i>
        </a>
    </li>
    <li>
        <a target="_blank" href="tel:025-85368086">
            <span class="orange"><i class="icon iconfont icon-dianhua1"></i></span>
            <span>电话</span>
            <i class="icon iconfont icon-youjiantou"></i>
        </a>
    </li>
</ul>
<script src="js/layer.js" type="text/javascript"></script>
<script type="text/javascript" src="js/main.js"></script>
<script>
    $(function(){
        $(".questionList").on("click","li",function(){
            //问题详情
            layer.open({
                shadeClose: false,
                content: '\<\div id="ListBox">' +
                '<div class="listTop">' +
                '<div class="title"><h4>积分有什么用</h4><i class="icon close">×</i></div>'+
                '<div class="main"><p>1. 积分可以兑换商品</p><p>2. 积分可以提现（10积分=1元）</p></div>'+
                '</div>'+
                '<div class="listBot"><h4>关联问题</h4><ul><li>积分怎么获得</li><li>积分怎么兑换商品</li><li>为什么积分提现会失败</li></ul></div>'+
                '\<\/div>'
                ,skin: 'footer'
            });
        });
        //切换问题
        $(document).on("click",".listBot ul li",function(){
            var t = $(this).text();
            $("#ListBox .listTop .title h4").text(t);
        });
        //关闭弹窗
        $(document).on("click","#ListBox .close",function(){
            layer.closeAll();
        });
    })
</script>
</body>
</html>